<template>
    <el-col
        :xs="24"
        :sm="8"
        :md="6"
        :lg="4"
        :xl="3">
        <el-card>
            <div class="zc-home-card-box">
                <div class="zc-home-card-avtar">{{ company.avtar }}</div>
                <div>
                    <div class="zc-home-card-title">{{ company.name }}</div>
                    <div class="zc-home-card-expire">{{
                        company.expireAt === null ? '永久有效' : company.expireAt + '到期'
                        }}
                    </div>
                </div>
            </div>
            <el-button class="zc-home-card-action" @click="doCompany">进入</el-button>
        </el-card>
    </el-col>
</template>
<script setup type="ts">
import {onMounted} from "vue";
import router from "@/router";

const props = defineProps({
    // 公司组织
    company: {
        type: Object,
        default: () => {
        }
    }
});

const doCompany = () => {
    const companyId = props.company.id;
    router.push({name: 'companyDesk', params: {companyId}})
}


onMounted(() => {
    // 处理第一个字符
    if (props.company) {
        props.company.avtar = props.company.name.charAt(0);
    }

})
</script>
